<template>
	<view class="index">
		<u-navbar class="nav" :bgColor="subColor" titleStyle="color:#fff;font-size:28rpx;" :placeholder="true">
			<view class="f-c u-nav-slot" slot="left"></view>
			<view class="f-c u-nav-slot" slot="center">
				<text class="wei6 f14 c0">我的</text>
			</view>
		</u-navbar>
		<view class="back" :style="{background:subColor}"></view>
		<view class="dfbc c0 f16 backfix bs10 bf" @click="tocenter">
			<view class="dfa">
				<u-avatar :src="adminInfo.avatar" size="50" shape="circle"></u-avatar>
				<view class="ml10 f-y-bt h100 pt5">
					<view class="f14 mb5">{{adminInfo && adminInfo.username}}</view>
					<text class="f14 mb5">欢迎您，{{adminInfo && adminInfo.nickname}}</text>
					<text class="f14">上次登录于{{adminInfo.last_login_time}}</text>
				</view>
			</view>
			<u-icon name="arrow-right" color="#000" size="12"></u-icon>
		</view>
		<view class="p10 f-1">
			<view class="bs6 bf p-0-10 mb20">
				<u-cell-group :customStyle="{color:'#000',fontSize:'28rpx'}" :border="false">
					<u-cell v-for="(v,i) in list" :key="i" :title="v.title" :value="v.value" :name="v.url"
						:isLink="true" :iconStyle="{color:subColor}" size="large" :border="false" :clickable="false"
						@click="tourl" v-if="role.includes(v.role)">
						<view slot="icon">
							<image :src="v.img" mode="" style="width: 36rpx;height:36rpx"></image>
						</view>
					</u-cell>
				</u-cell-group>
			</view>
			<!-- <u-button size="large" :customStyle="{color:'#000'}" color="linear-gradient(to right, #fee14f, #fdc450)"
				shape="circle" text="切换店铺" type="info" @click="goShop"></u-button>
			<view class="mb10"></view> -->
			<u-button size="large" :customStyle="{color:'#000',width:'80%',fontWeight:'bold',marginTop:'100rpx'}"
				color="linear-gradient(to right, #fee14f, #fdc450)" shape="circle" text="退出登录" type="info"
				@click="logOut"></u-button>
		</view>
		<tab-bar></tab-bar>
	</view>
</template>

<script>
	import {
		mapState,
	} from 'vuex'
	import TabBar from '@/components/common/tabbar.vue'
	import site from '@/custom/siteroot.js';
	export default {
		components: {
			TabBar,
		},
		data() {
			return {
				subColor: uni.getStorageSync('subject_color'),
				src: '',
				list: [{
					icon: 'icon-xinjianbuhegedanbeifen',
					title: '门店设置',
					value: '',
					url: '/pages/home/setting/index',
					img: `${getApp().globalData.onImgurl}imgs/my/3.png`,
					role: 'mendianshezhi',
				}, {
					icon: 'icon-a-bianzu32beifen2',
					title: '关于我们',
					value: '',
					img: `${getApp().globalData.onImgurl}imgs/my/2.png`,
					url: '/pages/mine/about',
					role: 'wode',
				}, {
					icon: 'icon-anbaoxunjianbeifen',
					title: '检查更新',
					value: `${getApp().globalData.version}`,
					img: `${getApp().globalData.onImgurl}imgs/my/1.png`,
					role: 'wode',
				}, {
					icon: 'icon-a-bianzu13beifen2',
					title: '帮助中心',
					value: '',
					img: `${getApp().globalData.onImgurl}imgs/my/4.png`,
					url: '/pages/mine/help',
					role: 'wode',
				}, {
					icon: 'icon-a-bianzu34beifen',
					title: '意见反馈',
					value: '',
					img: `${getApp().globalData.onImgurl}imgs/my/5.png`,
					url: '/pages/mine/feedback',
					role: 'wode',
				}],
				storeInfo: {},
				site,
				adminInfo: {},
			};
		},
		computed: {
			...mapState({
				user: state => state.user,
				role: state => state.user.roleData || [],
			}),
		},
		onLoad() {
			let info = uni.getStorageSync('storeInfo')
			this.adminInfo = uni.getStorageSync('adminInfo')
			if (info) {
				this.storeInfo = info
			}
		},
		methods: {
			tocenter() {
				return
				uni.navigateTo({
					url: "/pages/mine/center/index"
				})
			},
			tourl(e) {
				if (e.name) {
					uni.navigateTo({
						url: e.name
					})
				}
			},
			goShop() {
				uni.removeStorageSync('storeId')
				uni.reLaunch({
					url: '/pages/login/selectShop'
				})
			},
			logOut() {
				uni.showModal({
					title: '提示',
					content: '请确认是否退出登录吗?',
					success: async (res) => {
						if (res.confirm) {
							uni.removeStorageSync('token')
							uni.removeStorageSync('storeId')
							uni.removeStorageSync('adminInfo')
							uni.removeStorageSync('menus')
							uni.reLaunch({
								url: '/pages/login/index'
							})
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.back {
		padding: 50upx 20upx;
	}

	.backfix {
		padding: 40upx 20upx;
		margin: 0 30rpx;
		margin-top: -80rpx;
	}

	/deep/.u-cell__title-text,
	.u-button__text {
		font-size: 28rpx !important;
	}

	/deep/.u-cell__body {
		padding: 30rpx 0 !important;
	}

	/deep/.u-cell__left-icon-wrap {
		margin-right: 16rpx !important;
	}

	/deep/.u-cell__value--large {
		font-size: 24rpx !important;
		color: #999 !important;
	}

	/deep/.u-icon__icon--info {
		font-size: 24rpx !important;
	}

	/deep/.u-cell__body--large {
		padding-top: 20rpx !important;
		padding-bottom: 20rpx !important;
	}

	.version {
		width: 50%;
		margin: 0 auto;
		margin-bottom: 185rpx;
		display: flex;
		justify-content: center;
		color: #c4c4c4;
		font-size: 20rpx;
	}
</style>